<#import "../tpl/pageTep.ftl" as page>
<@page.pageBase currentMenu="机构审核">
<style>

    /***循环的表单设置***/
    .bui-select .bui-select-input {
        width: 250px;
    }
    .button-large {
        padding: 10px 30px;
        font-size: 16px;
    }
    hr{
        border-color: #009688;
    }
</style>
<div class="xm-offline">
    <div class="row">
        <div class="panel">
            <div class="panel-header">
                <a href="${basepath}/manage/organize/toCheck">返回上一级</a>
            </div>
            <div class="panel-body">
                <form id="detailForm" class="form-horizontal" action="${basepath}/manage/organize/updateJson"
                      method="post">
                    <input type="hidden" class="control-text span-width span10" name="id" value="${organize.id!}"
                           id="id"/>
                    <input type="hidden" class="control-text span-width span8" name="content"
                           disabled="disabled" value="${organize.content!}">

                    <h3>审批信息</h3>
                    <hr>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            机构名称：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="name" disabled="disabled"
                                   value="${organize.name!}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            负责人：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="principal"
                                   disabled="disabled" value="${organize.principal!}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            联系电话：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="principalPhone"
                                   disabled="disabled" value="${organize.principalPhone!}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            机构编码：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="id"
                                   disabled="disabled" value="${organize.id!}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            成立时间：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="buildTime"
                                   disabled="disabled" value="${organize.buildTime!}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            入驻时间：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="createTime"
                                   disabled="disabled" value="${organize.createTime!}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            所在地区：
                        </label>

                        <div class="controls bui-form-group-select" data-type="city">
                            <input type="text" class="control-text span-width span2" name="province"
                                   value="${organize.province!}" disabled="disabled"/>&nbsp;&nbsp;
                            <input type="text" class="control-text span-width span2" name="city"
                                   value="${organize.city!}" disabled="disabled"/>&nbsp;&nbsp;
                            <input type="text" class="control-text span-width span2" name="area"
                                   value="${organize.area!}" disabled="disabled"/>&nbsp;&nbsp;
                            <input type="text" class="control-text span-width span10" name="address"
                                   value="${organize.address!}" disabled="disabled"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            意向服务领域：
                        </label>

                        <div class="controls">
                            <input type="text" class="control-text span-width span8" name="field"
                                   value="${organize.field!}" disabled="disabled"/>
                        </div>
                    </div>
                    <div class="control-group" id="organization-img">
                        <label class="control-label">
                            <s>*</s>
                            机构图片：
                        </label>
                    </div>
                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            机构介绍：
                        </label>

                        <div class="controls control-row12" style="height: 350px;initialFrameWidth: 100%;">
                            <textarea type="text" class="input-large" name="content"
                                      id="content">${organize.content!}</textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="panel-body">
                <form id="editForm" class="form-horizontal" action="${basepath}/manage/organize/updateOrganizeJson"
                      method="post">
                    <input type="hidden" class="control-text span-width span10" name="id" value="${organize.id!}"/>
                    <input type="hidden" class="control-text span-width span8" name="contents" value="contents">

                    <div class="control-group">
                        <label class="control-label">
                            <s>*</s>
                            审批操作：
                        </label>

                        <div class="controls">
                            <select data-rules="{required:true}" name="status" id="status">
                                <option value="0">未处理</option>
                                <option value="1">通过</option>
                                <option value="2">不通过</option>
                            </select>
                        </div>
                    </div>
                    <div class="operation" style="display:none;">
                        <h3 class="offset2">绑定上下级
                        </h3>
                        <hr>
                        <div class="control-group">
                            <label class="control-label">
                                <s>*</s>
                                机构等级：
                            </label>

                            <div class="controls" id="rankSelect">
                                <input type="hidden" id="rank" value="0" name="rank">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label">
                                上级机构：
                            </label>

                            <div class="controls" id="parentIDSelect">
                                <input type="hidden" id="parentID" name="parentID">
                            </div>
                        </div>
                        <h3 class="offset2">下级机构
                            <a class="button button-primary pull-right" id="subBtn" style="height:20px">添加</a>
                        </h3>
                        <hr/>
                        <input type="hidden" class="control-text span-width " name="subID" id="sub">

                        <div id="subGrid" class="sub-grid"></div>
                    </div>
                    <div class="centered">
                        <button type="submit" class="button  button-large  button-success">保存</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<#-------------------------------------------------------下级机构弹出框 begin-------------------------------------------------------->
<div id="subContent" style="display:none;">
    <form id="subForm" class="form-horizontal">
        <div class="row">
            <div class="control-group span16">
                <label class="control-label">选择下级机构：</label>

                <div class="controls" id="sonIDSelect">
                    <input type="hidden" id="sonID" value="0" name="sonID">
                </div>
            </div>
        </div>
    </form>
</div>
<#-------------------------------------------------------下级机构弹出框 end-------------------------------------------------------->
<script type="text/javascript">
    //ueditor编辑器不可编辑状态
    var editor = UE.getEditor('content', {
        readonly: true
    });
    var Grid = BUI.Grid;
    var Store = BUI.Data.Store;
    var Overlay = BUI.Overlay;
    var Select = BUI.Select, Data = BUI.Data;
    var editForm = new BUI.Form.Form({
        srcNode: '#editForm',
        submitType: 'ajax',
        callback: function (data) {
            if (data.success == true) {
                window.location.href = "${basepath}/manage/organize/toCheck"
            } else {
                alert(data.message);
            }
        }
    }).render();
    //审核操作未处理与不通过都是不出现根据机构级别上下级机构页面
    $("#status").change(function () {
        if ($(this).val() == '0' || $(this).val() == '2') {
            $(".operation").css("display", "none");
        }
        else {
            $(".operation").css("display", "block");
        }
    });
    /*--------------------------等级下拉选择框列表 begin --------------------*/
    var items = [
        {text: 'A级机构', value: '1'},
        {text: 'B级机构', value: '2'},
        {text: 'C级机构', value: '3'}
    ];
    var rankSelect = new Select.Select({
        render: '#rankSelect',
        valueField: '#rank',
        items: items
    });
    rankSelect.render();
    rankSelect.on('change', function (ev) {
        var rank = (ev.item.value - 1) > 0 ? ev.item.value - 1 : "";
        var sub = (parseInt(ev.item.value) + 1 ) < 4 ? parseInt(ev.item.value) + 1 : "";
        var obj = new Object();
        obj.rank = rank;
        parentIDStore.load(obj);
        obj.rank = sub;
        sonIDStore.load(obj);

    });
    /*--------------------------等级下拉选择框列表  end--------------------*/
    /*--------------------------上级下拉选择框列表 begin --------------------*/
    var parentIDStore = new Data.Store({
        url: '${basepath}/manage/organize/selectOrganizeList',
        autoLoad: true,
        root: 'data'
    });
    var parentIDSelect = new Select.Select({
        render: '#parentIDSelect',
        valueField: '#parentID',
        list: {
            itemTpl: '<li>{name}</li>',
            idField: 'id',
            elCls: 'bui-select-list'
        },
        store: parentIDStore
    });
    parentIDSelect.render();
    /*--------------------------上级下拉选择框列表  end--------------------*/
    /*--------------------------下级弹出框列表  begin--------------------*/
    //编辑按钮事件
    $('#subBtn').on('click', function () {
        if ($("#rank").val() == "1" || $("#rank").val() == "2") {
            subDialog.show();
        } else if ($("#rank").val() == "3") {
            BUI.Message.Alert('C级机构没有下级机构', function () {
            }, 'info');

        } else {
            BUI.Message.Alert('还没选中机构等级', function () {
            }, 'info');
        }

    });
    var subDialog = new BUI.Overlay.Dialog({
        title: '选择下级机构',
        width: 500,
        height: 120,
        contentId: 'subContent',
        success: function () {
            addSubAjax();
        }
    });
    function addSubAjax() {
        $.ajax({
            type: "POST",
            url: "${basepath}/manage/organizeRelation/insertJson",
            data: {
                parentID: $("#id").val(),
                sonID: $("#sonID").val()
            },
            dataType: "json",
            success: function (data) {
                var obj = new Object();
                obj.id = $("#id").val();
                subStore.load(obj);
                if (data.success == true) {

                } else {
                    BUI.Message.Alert('该机构已经被绑定', function () {
                    }, 'info');
                }
                //弹出框点击确认关闭
                subDialog.close();

            }
        });
    }
    var subForm = new BUI.Form.Form({
        srcNode: '#subForm',
        submitType: 'ajax',
        callback: function (data) {
        }
    }).render();
    /*--------------------------下级弹出框列表  end--------------------*/
    /*--------------------------下级下拉选择框列表 begin --------------------*/
    var sonIDStore = new Data.Store({
        url: '${basepath}/manage/organize/selectAllList',
        autoLoad: true,
        root: 'data'
    });
    var sonIDSelect = new Select.Select({
        render: '#sonIDSelect',
        valueField: '#sonID',
        list: {
            itemTpl: '<li>{name}</li>',
            idField: 'id',
            elCls: 'bui-select-list'
        },
        store: sonIDStore
    });
    sonIDSelect.render();
    /*--------------------------下级下拉选择框列表  end--------------------*/
    /*--------------------------下级列表  begin--------------------*/
    var subColumns = [
        {
            title: '机构名称', dataIndex: 'name', width: '50%'
        },
        {
            title: '操作', dataIndex: 'id', width: '50%', renderer: function (data) {
            return '<a href="javascript:delFunction(' + data + ')" >删除</a>';

        }
        }
    ];
    var subStore = new Store({
        url: '${basepath}/manage/organize/selectSubList',
        autoLoad: true,
        params: {
            id: $("#id").val()
        },
        root: 'data'
    });
    var subGrid = new Grid.Grid({
        render: '#subGrid',
        width: '100%',//如果表格使用百分比，这个属性一定要设置
        columns: subColumns,
        idField: 'title',
        store: subStore
    });
    subGrid.render();
    //删除选中的记录
    function delFunction(id) {
        $.ajax({
            type: "POST",
            url: "${basepath}/manage/organizeRelation/deleteJson",
            dataType: "json",
            data: {
                sonID: id,
                parentID: $("#id").val()

            },
            success: function (data) {
                subStore.load();
            }
        })
    }
    /*--------------------------下级列表  end--------------------*/

    /*--------------------------多张机构图片分割  begin--------------------*/
    var imgArr = "${organize.picture!}".split(",");
    var imgHtml = "";
    for (var i = 0; i < imgArr.length; i++) {
        imgHtml += '<img src="/' + imgArr[i] + '"/ style="height: 100px;width: 100px;margin:0 0 10px 10px" />';//创建img标签，图片地址赋值src
    }
    document.getElementById("organization-img").innerHTML += imgHtml;
    /*--------------------------多张机构图片分割  end--------------------*/


</script>
</@page.pageBase>